<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Socket-Man</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script type="text/javascript" src="/js/jquery-1.11.3.js"></script>
    <link href="/js/button.css" rel="stylesheet"/>
    <script>

        /**
         * test for json type return
         */
        function send() {
            var url = $("#url").val();
            var port = $("#port").val();
            var data = $("#data").val();
            $.ajax({
                type: "POST",
                url: "/send",
                dataType: "text",
                data: {"url":url, "port":port, "data":data},
                success: function (msg) {
                    $("#msg").text(msg);
                }
            });
        }

    </script>
    <link rel="stylesheet" href="../static/js/button.css">
</head>
<body>
<h1>Socket-Man</h1>
<p>socket what ever you want, never post-man!
</p>

    <label for="url">ip：</label><input type="text" id="url" name="url" placeholder="www.baidu.com">
    <label for="port">port：</label><input size="5" type="text" id="port" name="port" value="80"><br>
    <label for="data">message：</label><br>
    <textarea name="data" id="data" wrap="hard" placeholder="GET / HTTP/1.1&#10Host: www.baidu.com&#10&#10"
              style="width:80%;height:100px;"></textarea><br>
    <a href="javascript:send()" class="a_demo" onclick="send()">send</a>


<h3>result</h3>
<textarea id="msg" style="width: 90%;height: 300px; border: 1px solid black;"></textarea>
<br>


</body>
</html>